import React, { Component } from 'react';
import { Redirect, Switch, Route } from 'react-router-dom'
import { Layout } from 'antd';

import memory from '../../utils/memoryUtils'
import Header from '../../components/header'
import LeftNav from '../../components/left-nav'

import Home from '../home/home'
import User from '../user/user'
import Role from '../role/role'

import './main.less'

class Main extends Component {

    state = {
        collapsed: ''
    }
    toggleCollapsed = (collapsed) => {
        this.setState({collapsed})
    }
    render () {
        const { Footer, Sider, Content } = Layout;
        if (!memory.user || !memory.user.username) {
           return <Redirect to='/login' />
        }
        return (
            <Layout style={{height: '100%'}}>
                <Sider width='230px' theme='light' trigger={null} collapsible collapsed={this.state.collapsed}>
                    <LeftNav collapsed={this.state.collapsed}></LeftNav>
                </Sider>
                <Layout>
                    <Header toggleCollapsed={ this.toggleCollapsed } >Header</Header>
                    <Content className='cont'>
                        <Switch>
                            <Route path='/home' component={Home} />
                            <Route path='/user' component={User} />
                            <Route path='/role' component={Role} />
                            <Redirect to='/home' />
                        </Switch>
                    </Content>
                    <Footer className='footer'>
                    © 2009-2018 zhangjianling.com 版权所有：思维空间技术博客版权所有 甘公网安备 33010002000
                    </Footer>
                </Layout>
            </Layout>
        );
    }
}

export default Main;